<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>轮播图</title>
  <style>
    #lunBo{
        display: block;
        float: left;
      width: 960px;
      height: 540px;
      background-color: #dab;
    }
    #lunBo img{
      width: 960px;
      height: 540px;
    }
    #guangGao{
        /*float: right;*/
        display: none;
        position: fixed;
        right: 0;
        top: 0;
        width: 18rem;
        height: 18rem;
        background-color: #dab;
    }
    .AGButton{
        width: 1.5rem;
        height: 1.5rem;
        border: blue 2px outset;
        background-color: #f6bc03;
        position: relative;
        float: right;

    }
    .clear{
        clear: both;
    }
  </style>
</head>
<body onload="init();">
<div id="guangGao">
    <button onclick="removeGuangGao()" id="closeButton" class="AGButton" title="点我移除广告">X</button>
    <button class="AGButton" title=""></button>
    <button onclick="closeGuangGao()" id="temporaryCloseButton" class="AGButton" title="点我关闭广告">—</button>
    <div class="clear"></div>
    <P>撒狄俄u发粉不顺利的开发板</P>
</div>
<div id="lunBo">
  <img src="../image/image_1.jpeg" alt="image_1" id="imageBox">
</div>
<button onclick="doIt();">Point me!</button>
<button onclick="inputMessage();">Input message!</button>
友情链接：<button onclick="openBaiDu();">百度</button>&nbsp;&nbsp;&nbsp;&nbsp;<button onclick="changePage();">切换页面</button>
<div class="clear"></div>
<hr/>
</body>
<script type="text/javascript">
    let aaa = "";
<!--    初始化函数-->
    function init(){
        let imageBox = document.getElementById("imageBox");
        let index = 2;
        setInterval(function (){
            if (index > 5){
                index = 1;
                imageBox.src = "../image/image_" + index + ".jpeg";
            }else {
                imageBox.src = "../image/image_" + index + ".jpeg";
            }
            index++;
        },1234);

        aaa = setInterval(function (){
                document.getElementById("guangGao").style.display = "block";
        },2000)

        // console.info("内窗口高度"+window.innerHeight);
        // console.info("内窗口宽度"+window.innerWidth);
        // console.info("浏览器高度"+window.outerHeight);
        // console.info("浏览器宽度"+window.outerWidth);
    //    获取显示器分辨率
    //     console.info(window.screen.availHeight);//可用高度
    //     console.info(window.screen.availWidth);//可用宽度
    //     console.info(location.hostname)
        console.info("当前网页地址："+location.pathname)
    }

    function doIt() {
        //弹出框
        if (window.confirm("Do you like me ?")){
            alert("You killed me!")
        }else {
            doIt();
        }
    }
//    输入框window.prompt
    function inputMessage() {
    let message = window.prompt("请输入你的信息：");
    if (message == null){
        console.info("你取消了输入！")
    }else{
        console.info("你输入的是："+message+"。")
    }
    }

//    打开新页面
    function openBaiDu() {
        window.open("https://www.baidu.com");
        // window.open("https://www.baidu.com","任意命名","width=300,height=400"); //控制新打开的窗口宽度和高度
        // window.open("http://chuji.run");
    }
//    创建数组
//     let array_1 = ["kiaks",454,"p",'k',4534];
//     for (let i = array_1.length; i < 19; i++){
//         array_1[i+1] = i * i;
//     }
//     console.info(array_1.length);
//     for (let key in array_1){
//         console.log(array_1[key]);
//     }
//    移除广告窗口
    function removeGuangGao() {
        // let body = document.getElementsByTagName("body");
        let AD = document.getElementById("guangGao");
        clearInterval(aaa); //终止定时任务
        AD.remove();
    }
//    关闭广告窗口
    function closeGuangGao() {
    document.getElementById("guangGao").style.display = "none";
    }

    function changePage() {
        //打开新网页
        location.assign("third.html")
    }

</script>
</html>